<style>
.qf-side-rank  {border:1px solid #ddd;}
.qf-side-rank .hd {height:28px;line-height:28px;background-color:#f2f2f2;border-bottom:1px solid #DBDBDE;}
.qf-side-rank .hd h3 {padding:0 8px;font:14px/28px "microsoft yahei";color:#666}
.qf-side-rank .bd {clear:both;}
/*样式1*/
.rank-style1 .item .goods-pic,.rank-style1 .item .goods-name,.rank-style1 .item .goods-name .goods-price {overflow:hidden}
.rank-style1 .item {position:relative;zoom:1;border-top:1px solid #DBDBDE;background:#F5F5F5;height:<{$setting.height}>px;padding:0 0 0 <{$setting.width+20}>px;}
.rank-style1 .item em,.rank-style1 .item .goods-pic {position:absolute;top:0;}
.rank-style1 .item em {left:2px;width:18px;height:18px;line-height:18px;background:url("images/rbg.gif") right 0;text-align:center;font-size:10px;color:#888;z-index:2}
.rank-style1 .item .goods-pic {left:0;display:table-cell;vertical-align:middle;*display:block;*font-family:Arial;text-align:center;z-index:1;width:<{$setting.width}>px;height:<{$setting.height}>px;*font-size:<{$setting.height*0.873}>px;*line-height:<{$setting.height}>px;}
.rank-style1 .item .goods-pic img {vertical-align:middle;max-width:<{$setting.width}>px;max-height:<{$setting.height}>px;_width:<{$setting.width}>px;_height:<{$setting.height}>px}
.rank-style1 .selected em,.rank-style1 .item em.hl {background-position:left 0;color:#e4393c}
.rank-style1 .fore1 {border-top:none}
/*
.rank-style1 .item .goods-name {word-break:break-all;word-wrap:break-word;padding-top:10px;line-height:20px;<{if $setting.showbuycount !='on'}>height:40px<{else}>height:20px<{/if}>}
*/

.rank-style1 .item .goods-price {color:#999;text-decoration:none;font-size:12px;font-weight:normal;text-decoration:none}
.rank-style1 .item .goods-price ins {color:#555;font-size:14px;font-weight:600;text-decoration:none}
.rank-style1 .item .goods-buycount {color:#999}
.rank-style1 .item .goods-buycount strong {color:#6a77b6;font-weight:normal}
/*样式2*/
.rank-style2 .item .goods-pic,.rank-style2 .item .goods-name,.rank-style2 .item .goods-name .goods-price {overflow:hidden}
.rank-style2 .item {position:relative;padding:8px 0 8px 22px;zoom:1;border-top:1px solid #DBDBDE;cursor:pointer}
.rank-style2 .item em {position:absolute;top:8px;left:-2px;width:18px;height:18px;line-height:18px;background:url("images/rbg.gif") right 0;text-align:center;font-size:10px;color:#ddd}
.rank-style2 .selected em,.rank-style2 .item em.hl {background-position:left 0;color:#e4393c}
.rank-style2 .item .goods-pic  {display:none}
.rank-style2 .item .goods-pic {width:<{$setting.width}>px;height:<{$setting.height}>px;float:left;vertical-align:middle;*font-family:Arial;*font-size:<{$setting.height*0.873}>px;*line-height:<{$setting.height}>px;text-align:center;margin:0 5px 0 -2px}
.rank-style2 .item .goods-pic img {vertical-align:middle;max-width:<{$setting.width}>px;max-height:<{$setting.height}>px;_width:<{$setting.width}>px;_height:<{$setting.height}>px}
.rank-style2 .fore1 {border-top:none}
.rank-style2 .item .goods-info {display:none}

.rank-style2 .item .goods-name {line-height:18px;height:18px;white-space:nowrap;text-overflow:ellipsis}

.rank-style2 .item .goods-price {color:#999;text-decoration:none;font-size:12px;font-weight:normal;text-decoration:none}
.rank-style2 .item .goods-price ins {color:#e4393c;font-size:14px;text-decoration:none}
.rank-style2 .item .goods-buycount {color:#999}
.rank-style2 .item .goods-buycount strong {color:#6a77b6;font-weight:normal}
.rank-style2 .selected  {height:<{$setting.height}>px;}

.rank-style2 .selected .goods-name {word-break:break-all;word-wrap:break-word;white-space:normal;<{if $setting.showbuycount !='on'}>height:36px<{else}>height:18px<{/if}>}

.rank-style2 .selected .goods-pic {display:table-cell;*display:block}
.rank-style2 .selected .goods-info {display:block}
</style>
<div id="focus_<{$widgets_id}>" class="qf-side-rank rank-<{$setting.style|default:'style1'}>"><{if $setting.title}><div class="hd"><h3><{$setting.title}></h3></div><{/if}><div class="bd clearfix"><ul class="ranklist" id="Ranks_<{$widgets_id}>">
<{assign var="do" value='1'}><{if count($data.goodsRows) >0}>
<{foreach from=$data.goodsRows item=row key=gid name=ranking}><li class="item fore<{$do}><{if $do ==1}> selected<{/if}>"><{assign var=pickey value=$setting.gpic_size|default:'goodsPicS'}><em<{if $do <= $setting.showing}> class="hl"<{/if}>><{$do}></em><div class="goods-pic"><a target="_blank" href="<{$row.goodsLink}>"><img src="<{$data.theme_dir}>/images/i/transparent.gif}>" data-src="<{$row[$pickey]}>" alt="<{$row.goodsName}>"<{if $setting.resize == 'on'}> width="<{$setting.width}>" height="<{$setting.height}>"<{else}> data-img-zoom="true"<{/if}> /></a></div><div class="goods-name"><a title="<{$row.goodsName}>" target="_blank" href="<{$row.goodsLink}>"><{$row.goodsName|cut:$setting.maxlength}></a></div><div class="goods-info">
  
  <!-- 验证判断和价格和数量显示  黄智坤 -->
			 <{if $data.check_login == 'login'}>
			 
<{if $setting.showgoodsSalePrice !='off' || $setting.showgoodsMarketPrice == 'on'}>
<div class="goods-price">

<{if $setting.showgoodsSalePrice !='off'}><ins class="price">
<{$setting.salePricetxt}>

<!--@zeng 2017.4.25 首页商品列表价格显示控制-->
<{if $row.products.1.info.member_state == '1'}>
<{$row.products.2.mlv_price|cur}>
<{else}>
<{$row.goodsSalePrice|cur}>
<{/if}>
<!--end-->

</ins>
<{/if}>
<{if $setting.showgoodsMarketPrice == 'on'}>
<del><{$setting.MarketPricetxt}><{$row.goodsMarketPrice|cur}>
</del><{/if}>
</div><{/if}>
<!-- <span>BBB</span>	 -->
		<{/if}>
		<!-- 这里是验证--未登录不显示价格 -->
<{if $setting.showbuycount =='on'}>
<div class="goods-buycount"><span><{$setting.btitle}></span><strong><{if $setting.buycount==1}>
<{$row.goodsBuyCount|default:'0'}><{else}><{$row.goodsBuyCountWeek|default:'0'}>
<{/if}></strong>
</div> 
<{/if}>
</div>

	
	<div class="goods-buy">
	           
	          <span class="product-buy-quantity">
		          <span class="item-content">
			          <span class="p-quantity">
			            <a href="javascript:void(0);" class="btn-decrease">-</a><input type="text" 
			            min="<{if $data.add.isused==1}><{$data.add.pernum}><{else}><{$row.peradd}><{/if}>" 
			            max="<{if $row.nostoreSell == 1}>999999999<{else}><{$row.products.0.store|number}><{/if}>" 
			            size="2" name="goods[num]" class="action-quantity-input" 
			            value="<{if $data.add.isused==1}><{$data.add.pernum}><{else}><{$row.peradd}><{/if}>">
			            <a href="javascript:void(0);" class="btn-increase">+</a>
			            <span class="p-store" style="float: left;"></span>
			            <input type="hidden" name="stock" value="">
	          			 
	          			 <input type="hidden"  class="action-quantity-input-getPeradd"  value="<{$row.peradd}>">
	          			 <input type="hidden"  class="action-quantity-input-havegift"  value="<{$row.products.3.type}>">
			       		 <input type="hidden"  class="action-quantity-input-getmaxbuy"  value="<{if $row.products.3.type =='havegift'}><{$row.products.4.maxbuy|number}><{else}><{$row.products.0.store|number}><{/if}>">
	          			 
			          </span>
		          </span>
	          </span>
	          <{if $env.conf.b2c.site.buy.target == '2'}>
	          <{assign var='buytarget' value='_blank_cart'}>
	          <{elseif $env.conf.b2c.site.buy.target == '3'}>
	          <{assign var='buytarget' value='_dialog_minicart'}>
	          <{/if}>
	          <input type="hidden" name="goods[goods_id]" value="<{$row.goodsId}>">
	          <input type="hidden" name="goods[product_id]" value="<{$row.products.0.product_id}>">
	          
              <a class="action-addtocart" href="<{link app=b2c ctl=site_cart act=add arg0=goods arg1=$row.goodsId arg2=$row.products.0.product_id arg3=1}>"<{if $buytarget}> target="<{$buytarget}>"<{/if}>>
              	<i class="icon">&#x3e;</i>
              </a>
	          
	        </div>

</li><{assign var="do" value=$do+1}><{/foreach}><{/if}></ul></div></div><script>window.addEvent('domready',function(){var topSales = $('Ranks_<{$widgets_id}>').getElements('.item');topSales && topSales.addEvent('mouseenter',function(){this.addClass('selected').getSiblings().removeClass('selected');})})</script>
<script>
bindQuantityEvent(focus_<{$widgets_id}>,setQuantity);
//== 为数量选择框绑定事件
function bindQuantityEvent(elements, callback) {
    elements = document.id(elements) || $$(elements);
    if(!elements && !elements.length) return;
    var value = '';
    elements.addEvents({
        //= 数量按钮
        
////////////////////////////////////
  	  //= edit by hzk 每次点击的（加减）数量
  	       'click:relay(.btn-decrease,.btn-increase)': function(e) {
  	            var getPeradd = this.getParent().getElement('.action-quantity-input-getPeradd');
  	            var input = this.getParent().getElement('.action-quantity-input');
  	            
  	            value = +input.value;
  	            perclicknum= parseInt((<{$data.add.isused}> ==1) ?  <{$data.add.pernum}>  : parseInt(getPeradd.value)) ;  
  	            
  	          //add by hzk 2017-5-18
	            checknum=value+perclicknum;
	            checkmaxbuy(this, checknum,'button');   	            
  	            
  	         // input.value = this.hasClass('btn-decrease') ? (value - perclicknum) : (value + perclicknum);
  	            peradd = this.hasClass('btn-decrease') ? (value - perclicknum) : (value + perclicknum);
  	            input.value = peradd - (peradd%perclicknum);
  	            
  	            callback && callback(input, value);
  	        },        
           
          ////////////////////////////////////
        //= 数量输入框
        'focus:relay(.action-quantity-input)': function(e){
            value = +this.value;
        },
        'change:relay(.action-quantity-input)': function(e) {
        	checkmaxbuy(this, value,'text'); 
            callback && callback(this, value);
        }
    });
}

//== 赠品封顶值提示方法 add by hzk 2017-5-18
function checkmaxbuy(e1, value,inputtype) {
	
	//alert(1);
	 //add by hzk 2017-5-18
var checkgift = e1.getParent().getElement('.action-quantity-input-havegift');	           
	//alert(checkgift.value);   
if('havegift'==checkgift.value){
	   var getmaxbuy = e1.getParent().getElement('.action-quantity-input-getmaxbuy');
		// alert(getmaxbuy.value);   
    if(!e1.hasClass('btn-decrease')){  
    	
				if(inputtype=='button' && getmaxbuy.value == value){
					Dialog.alert('该商品购买数量已达赠品优惠上限'+getmaxbuy.value+'，上限之后的购买数量将不赠送赠品，确定继续购买？');
	            }else if(inputtype=='text' && getmaxbuy.value<=value){
					Dialog.alert('该商品仅在前'+getmaxbuy.value+'个商品赠送赠品，上限数量之后的购买数量将不赠送赠品，确定继续购买？');
	            }
		} 
}
}

//== 获取商品数量值
function getQuantity(el, type) {
    return el.getElement('input[name=' + type + ']').value;
}
//== 设置商品数量
function setQuantity(input, value) {
    var type = 'product';
    var p = input.getParent('li');
    inputCheck(input, {min: input.get('min'), max: input.get('max'), 'default': value, store: getQuantity(p, 'stock'), callback: window.quantityCallback});
}
//== 商品数量输入框正确性检测
function inputCheck(input, options) {
    if(!input) return false;
    options = options || {};
    if(isNaN(options.min)) options.min = 1;
    if(isNaN(options.max)) options.max = 999999;
    options['default'] = options['default'] || options.min;
    var value = +input.value;
    var tips = new Tips(input);
    var pre = '';
    var msg = '';
    if(options.store && options.store - value <= 0) {
        pre = '库存有限，';
    }
    if(value < options.min) {
        input.value = options.min;
        msg = '此商品的最小购买数量为' + options.min + '件';
    }
    
    else if(value > options.max){
        input.value = options.max;
        msg = pre + '此商品最多只能购买' + options.max + '件';
    }
    
    else if(isNaN(value)) {
        input.value = options['default'];
        msg = '只允许输入数字';
    }
    if (msg) {
        tips.show(msg);
        return false;
    }
    tips.hide();
    if(options.callback) options.callback(input, options['default']);
    return true;
}

</script>
